<template>
	<view class="container">
		<view class="search flex align-center">
			<u-search  :focus="true" style="width: 100%;" placeholder="请输入你想搜索的内容" prefixIcon="search" v-model="inputText"
				@search="clickSearch" confirm-type="search" :show-action="false" maxlength="60">
			</u-search>
		</view>
		<scroll-view class="scroll" scroll-y :refresher-threshold="50" :refresher-background="'#FDFDFD'"
			:refresher-enabled="true" :refresher-triggered="isRefreshing" @refresherrefresh="refresherrefresh"
			@scrolltolower="loadMore">
			<view class="shop-list">
				<view class="shop-item" v-for="(item, index) in shopList" :key="index" @click="goShopDetail(item)">
					<view class="img">
						<image :src="item.pic[0]" mode="aspectFill"></image>
					</view>
					<view class="item">
						<view class="title1 ellipsis1">
							<mp-html :tag-style="tagStyle" container-style="color: #333;font-style: 32rpx;font-weight: bold;"
								:content="item.name">
							</mp-html>
						</view>
						<text class="title2">
							{{ item.price == 0 ? '面议' : '¥' + item.price }}
						</text>
						<text class="title3 ellipsis1">
							{{ item.serviceinfo.city }}丨{{ item.serviceinfo.name }}
						</text>
					</view>
				</view>
				<uni-load-more v-if="shopList.length > 0" :status="shopStatus"></uni-load-more>
				<view v-if="shopList.length === 0" class="empty-wrap">
					<image class="empty-img"
						src="https://xzcs-public-files.oss-cn-beijing.aliyuncs.com/static/coupon/contentVanshi.png"></image>
					<text class="tips">暂无结果</text>
				</view>
			</view>
		</scroll-view>
	</view>
</template>

<script>
import enterpriseServer from "@/static/js/enterpriseServer/index.js"
import { hightLightText } from "@/utils/utils.js"
export default {
	data() {
		return {
			inputText: '',
			isRefreshing: false,
			shopPage: 1,
			shopPageSize: 10,
			//服务商品列表
			shopList: [],
			shopStatus: 'nomore',
			sortKey: 0,
			tagStyle: {
				em: 'font-style: normal;color: #fa3534;'
			}
		}
	},
	methods: {
		goBack() {
			uni.navigateBack({
				delta: 1
			})
		},

		async clickSearch() {
			this.shopStatus = 'loading'
			uni.showLoading({
				title: '加载中'
			})
			let obj = {
				cate: "",
				keyword: this.inputText,
				page: this.shopPage,
				pagesize: this.shopPageSize,
				sort: this.sortKey
			}
			let res = await enterpriseServer.getShopList(obj)
			if (res.code === 1) {
				let arr = []
				if (this.shopPage == 1) {
					this.shopList = []
				}
				let newList = res.data
				if (newList.length >= this.shopPageSize) {
					this.shopStatus = 'more'
				} else {
					this.shopStatus = 'nomore'
				}
				let arr1 = arr.concat(newList)
				arr1.forEach(val => {
					let obj = {
						id: val.id,
						name: hightLightText(val.name, this.inputText),
						pic: val.pic.split(','),
						price: val.price,
						serviceinfo: val.serviceinfo
					}
					this.shopList.push(obj)
				})
				this.isRefreshing = false
				uni.hideLoading()
			} else {
				this.$tools.msg(res.msg)
			}
		},

		//下拉刷新
		refresherrefresh() {
			this.isRefreshing = true;
			this.shopPage = 1
			this.clickSearch()
		},

		//上拉加载
		loadMore() {
			if (this.shopStatus == 'more') {
				this.shopPage += 1
				this.clickSearch()
			}
		},

		//跳转服务商品详情
		goShopDetail(item) {
			uni.navigateTo({
				url: "/enterpriseServer/productInfo/index?id=" + item.id
			})
		}
	}
}
</script>

<style lang="scss" scoped>
@import "index.scss";
</style>
